import React from 'react';
import Sidebar from './Sidebar';
import Header from './Header';
import './document.css';

const MyDocs: React.FC = () => {
  return (
    <div className='document-container'>
      <Sidebar activeItem='my-docs' />
      <div className='main-content'>
        <Header />
        <div className='content-area'>
          <div className='content-header'>
            <h1>我的文档</h1>
            <p>管理您创建的所有文档</p>
          </div>
          <div className='content-body'>
            <div className='welcome-card'>
              <h2>我的文档列表</h2>
              <p>您创建和拥有的文档</p>
              <div className='feature-grid'>
                <div className='feature-item'>
                  <h3>📄 个人笔记</h3>
                  <p>最后编辑: 2024-01-20</p>
                </div>
                <div className='feature-item'>
                  <h3>📊 工作报告</h3>
                  <p>最后编辑: 2024-01-18</p>
                </div>
                <div className='feature-item'>
                  <h3>📝 学习计划</h3>
                  <p>最后编辑: 2024-01-15</p>
                </div>
                <div className='feature-item'>
                  <h3>📋 待办事项</h3>
                  <p>最后编辑: 2024-01-12</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
};

export default MyDocs;
